import { checkHEX } from '~/utils/common'

export function setDefaultLayoutStyles(ComputedSettings) {
  document.documentElement.style.setProperty(`--menu-background`, '#384e6a') // #384e6a
  document.documentElement.style.setProperty(`--menu-hover-color`, '#263445') // #263445
  document.documentElement.style.setProperty(`--menu-text-color`, '#aab9ca') // #aab9ca
  document.documentElement.style.setProperty(`--menu-active-text-color`, '#409eff') // #409eff
  document.documentElement.style.setProperty(`--menu-active-sub-menu-text-color`, '#ffffff') // #ffffff
  document.documentElement.style.setProperty(`--tagbar-active-tag-color`, '#384e6a') // #384e6a
  ComputedSettings.layout.menuBackground = '#384e6a'
  ComputedSettings.layout.menuHoverColor = '#263445'
  ComputedSettings.layout.menuTextColor = '#aab9ca'
  ComputedSettings.layout.menuActiveTextColor = '#409eff'
  ComputedSettings.layout.menuActiveSubMenuTextColor = '#ffffff'
  ComputedSettings.layout.tagbarActiveTagColor = '#384e6a'
}

export function setLayoutStyles(ComputedSettings, layout) {
  if (layout.menuBackground && checkHEX(layout.menuBackground)) {
    document.documentElement.style.setProperty(`--menu-background`, layout.menuBackground)
  }
  if (layout.menuHoverColor && checkHEX(layout.menuHoverColor)) {
    document.documentElement.style.setProperty(`--menu-hover-color`, layout.menuHoverColor)
  }
  if (layout.menuTextColor && checkHEX(layout.menuTextColor)) {
    document.documentElement.style.setProperty(`--menu-text-color`, layout.menuTextColor)
  }
  if (layout.menuActiveTextColor && checkHEX(layout.menuActiveTextColor)) {
    document.documentElement.style.setProperty(`--menu-active-text-color`, layout.menuActiveTextColor)
  }
  if (layout.menuActiveSubMenuTextColor && checkHEX(layout.menuActiveSubMenuTextColor)) {
    document.documentElement.style.setProperty(`--menu-active-sub-menu-text-color`, layout.menuActiveSubMenuTextColor)
  }
  if (layout.tagbarActiveTagColor && checkHEX(layout.tagbarActiveTagColor)) {
    document.documentElement.style.setProperty(`--tagbar-active-tag-color`, layout.tagbarActiveTagColor)
  }
  ComputedSettings.layout.menuBackground = layout.menuBackground
  ComputedSettings.layout.menuHoverColor = layout.menuHoverColor
  ComputedSettings.layout.menuTextColor = layout.menuTextColor
  ComputedSettings.layout.menuActiveTextColor = layout.menuActiveTextColor
  ComputedSettings.layout.menuActiveSubMenuTextColor = layout.menuActiveSubMenuTextColor
  ComputedSettings.layout.tagbarActiveTagColor = layout.tagbarActiveTagColor
}
